<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        .zhtt-row{
            color:#fff;
            font-size:16px;
            margin:8px;
        }
        a{
            text-decoration-line: none;
        }
    </style>
</head>
<body>
<div class="zhtt-row">
    <a href="flex01.html" target="_blank">上中下布局</a>
</div>
<div class="zhtt-row">
    <a href="flex02.html" target="_blank">上中下：1、上固定高度、下自适应；2、下分为上、下，上自适应、下固定高度；</a>
</div>
<div class="zhtt-row">
    <a href="flex03.html" target="_blank">上下布局：上面固定高度，下面自适应</a>
</div>
<div class="zhtt-row">
    <a href="flex03-01.html" target="_blank">上下布局：下面固定高度，上面自适应</a>
</div>
<div class="zhtt-row">
    <a href="flex03-02.html" target="_blank">上中下布局：下面固定高度，中间自适应，下面固定高度</a>
</div>
<div class="zhtt-row">
    <a href="flex04.html" target="_blank">左右布局：左侧固定宽度、右侧自适应</a>
</div>
<div class="zhtt-row">
    <a href="flex05.html" target="_blank">左右布局：右侧固定宽度、左侧自适应</a>
</div>
<div class="zhtt-row">
    <a href="flex06.html" target="_blank">左中右布局：左侧固定宽度、中间自适应、右侧固定宽度</a>
</div>
<div class="zhtt-row">
    <a href="flex07.html" target="_blank">上中（左、右）下</a>
</div>
</body>
</html>
